<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <div class="header">
        <div class="container">
            <div class="nav">
                <img src="./images/博文logo.jpg" alt="">
                <div class="nav-right">
                    <a href="">HOME</a>
                    <a href="">ABOUT</a>
                    <a href="">PROTFOLIO</a>
                    <a href="">SERVICE</a>
                    <a href="">NEWS</a>
                    <a href="">CONTSCT</a>
                </div>
            </div>
        </div>
        <div class="banner">
            <img src="./images/轮播图.jpg" alt="">
        </div>
    </div>

    <div class="main">
        <div class="mark1">
            <div class="container">
                <div class="content">
                    <div class="up">
                        <div class="box">
                            <div class="box-left"></div>
                            <span>服务范围</span>
                            <div class="box-right"></div>
                            <br>
                            <div class="wenzi"> OUR&nbsp;SERVICES</div>

                        </div>
                    </div>
                    <div class="down">
                        <div class="box">
                            <div class="img"> <img src="./images/圆1.jpg" alt=""></div>
                            <a href="" class="big">1.WEB&nbsp;DESIGGN</a>
                            <div class="xiao">
                                <a href="">企业品牌网站设计/手机网站制作<br>动画网站创意设计</a>
                            </div>

                        </div>
                        <div class="box">
                            <div class="img"> <img src="./images/圆2.jpg" alt=""></div>
                            <a href="" class="big">2.GRAPHIC&nbsp;DESIGGN</a>
                            <div class="xiao">
                                <a href="">标志LOGO设计/产品宣传册设计<br>企业广告/海报设计</a>
                            </div>

                        </div>
                        <div class="box">
                            <div class="img"> <img src="./images/圆3.jpg" alt=""></div>
                            <a href="" class="big">3.E-BUSINESS&nbsp;PLAN</a>
                            <div class="xiao">
                                <a href="">淘宝/天猫装修设计及运营推广<br>企业微博、微信营销</a>
                            </div>

                        </div>
                        <div class="box">
                            <div class="img"> <img src="./images/圆4.jpg" alt=""></div>
                            <a href="" class="big">4.MAILBOXAGENTS</a>
                            <div class="xiao">
                                <a href="">腾讯/网易企业邮箱品牌代理<br>个性化邮箱定制开发</a>
                            </div>

                        </div>
                    </div>
                </div>

            </div>

        </div>
        <div class="mark2">
            <div class="container">
                <div class="content2">
                    <div class="up">
                        <div class="box">
                            <div class="box-left"></div>
                            <span class="kehu">{ 客户案例 }</span>
                            <div class="box-right"></div>
                            <br>
                            <div class="wenzi"> With the best professional technology, to design the best innovative web
                                site</div>

                        </div>
                    </div>

                    <div class="down">
                        <img src="./images/图1.jpg" alt="">
                        <img src="./images/图2.jpg" alt="">
                        <img src="./images/图3.jpg" alt="">

                    </div>
                    <button>VIEW&nbsp;MORE</button>

                </div>
            </div>

        </div>
        <div class="mark3">
            <div class="container">
                <div class="content3">
                    <div class="up">
                        <div class="box">
                            <div class="box-left"></div>
                            <span class="kehu">最新资讯</span>
                            <div class="box-right"></div>
                            <br>
                            <div class="wenzi">TEH LATEST NEWS</div>

                        </div>

                    </div>
                    <div class="down">
                        <img src="./images/图4.jpg" alt="">
                        <div class="out-box">
                            <div class="inner">
                                <div class="inner-left">
                                    <div class="date">
                                        09
                                    </div>
                                    <div class="month">
                                        Jan
                                    </div>
                                </div>
                                <div class="inner-right">
                                    <span class="right-up">网站排名进入前三的技巧说明</span>

                                    <div class="right-down">很多客户都会纳闷为什么自己的网站老是优化不到搜索引擎
                                        首页，更不用说进首页前三了。那么网站优...
                                    </div>
                                </div>
                            </div>
                            <div class="inner">
                                <div class="inner-left">
                                    <div class="date">
                                        06
                                    </div>
                                    <div class="month">
                                        Jan
                                    </div>
                                </div>
                                <div class="inner-right">
                                    <span class="right-up">flash网站制作的优缺点</span>

                                    <div class="right-down">虽然HTML5程序语言出现，大有逐渐代替Flash网站制作的意味，但是过于生硬的HTML5动画效果，始终...
                                    </div>
                                </div>
                            </div>
                            <div class="inner">
                                <div class="inner-left">
                                    <div class="date">
                                        07
                                    </div>
                                    <div class="month">
                                        Jan
                                    </div>
                                </div>
                                <div class="inner-right">
                                    <span class="right-up">做个网站多少钱？</span>

                                    <div class="right-down">“做个网站多少钱？”很多客户打电话过来直接第一句就抛出来的问题。这好比买辆车多少钱，你是要...
                                    </div>
                                </div>
                            </div>
                            <div class="inner">
                                <div class="inner-left">
                                    <div class="date">
                                        06
                                    </div>
                                    <div class="month">
                                        Jan
                                    </div>
                                </div>
                                <div class="inner-right">
                                    <span class="right-up">哪些网站优化手法属于网站过度优化</span>

                                    <div class="right-down">大部分人都想让自己的网站，一夜之间出现在搜索引擎首页，独占鳌头。但是事实告诉我们罗马不是一...
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>

            </div>
        </div>
    </div>
    <div class="foot">
        <div class="container">
            <div class="left">
                Copyright 2006- 2014 Bowenshangmei Culture All Rights Reserved
            </div>
            <div class="right">
                Home &emsp;|&emsp; About&emsp; | &emsp;Portfolio&emsp; |&emsp; Contact
            </div>
        </div>

    </div>

</body>

</html>